<!DOCTYPE html>
<html>
<head>
    <title>Project</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale = 1.0, maximum-scale=1.0, user-scalable=no" />
    <link href='http://fonts.googleapis.com/css?family=Fjalla+One|Open+Sans:400,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/font.css"/>
    <link rel="stylesheet" href="css/normalize.css"/>
    <link rel="stylesheet" href="css/reset.css"/>
    <link rel="stylesheet" href="css/style.css"/>
    <!--[if lte IE 7]>
    <link rel="stylesheet" href="css/ie7.css"/>
    <![endif]-->
    <!--[if lte IE 8]>
    <link rel="stylesheet" href="css/ie8.css"/>
    <![endif]-->
    <link rel="stylesheet" href="css/sequencejs-theme.modern-slide-in.css"/>
    <link rel="stylesheet" href="css/jquery.sidr.dark.css"/>
    <link rel="stylesheet" href="css/responsive.css"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" src="js/html5.js"></script>
    <![endif]-->
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="js/twitter.min.js"></script>
    <script type="text/javascript" src="js/jquery.sequence-min.js"></script>
    <script type="text/javascript" src="js/jquery.sidr.min.js"></script>
	<script type="text/javascript" src="js/jquery.validate.min.js"></script>
	<script type="text/javascript" src="js/jquery.form.js"></script>
    <script type="text/javascript" src="js/script.js"></script>
</head>
<body>

<div id="wrapper">
    <header id="header">
        <span class="top-line"></span>
        <div class="container_12">
            <div class="top-login-reg">
                <a href="#">Login</a>
                <a href="#">Register</a>
            </div>
            <div class="clear"></div>
            <div class="head-menu clearfix">
                <h1 id="logo">
                    <a href="index.html">
                        <img src="images/logo.png" alt="$SITE_NAME"/>
                    </a>
                </h1>
                <nav class="main-nav">
                    <ul id="main-menu" class="nav nav-horizontal">
                        <li class="has-sub">
                            <a href="index.html">Home</a>
                            <ul class="sub-menu">
                                <li><a href="404.html">404 page</a></li>
                                <li><a href="maintenance.html">Maintenance page</a></li>
                            </ul>
                        </li>
                        <li class="has-sub">
                            <a href="about.html">About</a>
                            <ul class="sub-menu">
                                <li><a href="#">Who We Are</a></li>
                                <li><a href="#">How We Work</a></li>
                                <li><a href="#">Approach</a></li>
                                <li><a href="#">Mission</a></li>
                            </ul>
                        </li>
                        <li class="has-sub">
                            <a href="service.html">Service</a>
                            <ul class="sub-menu">
                                <li><a href="#">Web Design</a></li>
                                <li><a href="#">WordPress Development</a></li>
                                <li><a href="#">Graphic Design</a></li>
                                <li><a href="#">Custom Development</a></li>
                                <li><a href="#">APIs Integration</a></li>
                                <li><a href="#">Mobile Apps Development</a></li>
                                <li><a href="#">Consulting</a></li>
                                <li><a href="#">Promotion</a></li>
                            </ul>
                        </li>
                        <li class="active"><a href="portfolio.html">Portfolio</a></li>
                        <li><a href="blog.html">Blog</a></li>
                        <li><a href="contact-us.html">Contact us</a></li>
                    </ul>
                    <a id="btn-toogle-menu" class="btn-toogle-menu" href="#alternate-menu">
                        <span class="line-bar"></span>
                        <span class="line-bar"></span>
                        <span class="line-bar"></span>
                    </a>
                    <div id="right-menu">
                        <ul class="alternate-menu">
                            <li><a href="index.html">Home</a></li>
                            <li><a href="about.html">About</a></li>
                            <li><a href="service.html">Service</a></li>
                            <li><a href="portfolio.html">Portfolio</a></li>
                            <li><a href="blog.html">Blog</a></li>
                            <li><a href="contact-us.html">Contact us</a></li>
                        </ul>
                    </div>
                </nav>
            </div>
        </div>
        <div class="head-about-us container_12 clearfix">
            <div class="grid_12 content-about">
                <h2 class="common-title big">Portfolio</h2>
                <p class="rs description">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur.</p>
            </div>
        </div>
    </header><!--end: #header -->

    <div class="layout-2cols sidebar-left clearfix">
        <div class="content grid_9">
            <div class="project-detail">
                <h2 class="common-title mr-grid">Renty - Booking / Rental PSD Template</h2>
                <div class="project-img-description">
                    <img src="images/ex/th-581x618-1.jpg" alt="$PROJECT_NAME"/>
                    <img src="images/ex/th-581x618-2.jpg" alt="$PROJECT_NAME"/>
                </div>
            </div>
        </div><!--end: .content -->
        <div class="sidebar grid_3">
            <div class="menu-sidebar block">
                <div class="project-infomation">
                    <p class="rs project-description lh-heigher">Lorem ipsum dolor sit amet, consectetuer adipis elit aenean.</p>
                    <ul class="lh-heigher">
                        <li>Graphic Design</li>
                        <li>CSS</li>
                        <li>HTML</li>
                        <li>JavaScript</li>
                        <li>PHP</li>
                        <li>WordPress CMS</li>
                    </ul>
                    <p class="rs lh-heigher">Live example:</p>
                    <p class="rs lh-heigher"><a href="#" class="link-live-view">www.bestwebsoft.com</a></p>
                </div>
            </div>
            <div class="menu-sidebar block">
                <h3 class="common-title dark">Contact</h3>
                <div class="form contact-form">
                    <form id="contact-form" class="clearfix" action="processForm.php" method="post">
                        <label class="lbl-wrap" for="txt-name">
                            <input id="txt-name" class="txt" type="text" name="name" placeholder="Name"/>
                        </label>
                        <label class="lbl-wrap" for="txt-email-address">
                            <input id="txt-email-address" class="txt" type="email" name="email" placeholder="Email Address"/>
                        </label>
                        <label class="lbl-wrap" for="txt-phone">
                            <input id="txt-phone" class="txt" type="text" name="phone" placeholder="Phone"/>
                        </label>
                        <label class="lbl-wrap" for="txt-website">
                            <input id="txt-website" class="txt" type="text" name="website" placeholder="Website"/>
                        </label>
                        <label class="lbl-wrap" for="txt-message">
                            <textarea class="txt" name="message" id="txt-message" cols="30" rows="10" placeholder="Message"></textarea>
                        </label>
                        <p class="rs ta-r">
                            <span id="response"></span>
                               <input type="submit" id="submit-contact" class="btn-blue smaller" value="Submit"/>
                        </p>
                    </form>
                </div>
            </div>
            <div class="clear"></div>
        </div><!--end: .sidebar -->
    </div>
    <footer id="footer">
        <div class="info-line">
            <div class="container_12">
                <div class="grid_9">
                    <h2 class="rs common-title">Cras iaculis lacus vel enim ornare dapibus venenatis nunc semper</h2>
                    <p class="rs description">Cras quis enim ipsum. Nam convallis semper orci nec elementum. Donec lorem ante, sollicitudin eu feugiat vitae, egestas et risus. Integer quis nisi eu enim tincidunt rutrum.</p>
                </div>
                <div class="grid_3 ta-r">
                    <a class="btn-blue" href="#">Learn more</a>
                </div>
                <div class="clear"></div>
            </div>
        </div>
        <div class="container_12 main-footer">
            <div class="grid_3 contact-info">
                <h3 class="rs common-title">Contact Info</h3>
                <p class="rs img-map">
                    <img src="images/ex/th-map.jpg" alt="map"/>
                </p>
                <p class="rs contact-item">
                    <span class="lbl">T.:</span>
                    <span class="val">+1 (555) 555 - 55 - 55</span>
                </p>
                <p class="rs contact-item">
                    <span class="lbl">E.:</span>
                    <a href="mailto:info@megadrupal.com" class="val">info@megadrupal.com</a>
                </p>
            </div><!--end: .contact-info -->
            <div class="recent-tweets">
                <div class="inner">
                    <h3 class="rs common-title">recent tweets</h3>
                    <div class="lst-tweets" id="sys_lst_tweets">
                        <p class="rs ta-c fc-white">
                            loading Twitter <br />
                            <img src="images/spinner.gif" alt="loading"/>
                        </p>
                    </div>
                </div>
            </div><!--end: .recent-tweets -->
            <div class="email-newsletter">
                <div class="inner">
                    <h3 class="rs common-title">Newsletter Signup</h3>
                    <p class="rs description">Nam aliquet, velit quis consequat interdum, odio dolor elementum.</p>
                    <form action="#">
                        <div class="form-email">
                            <label class="lbl" for="txt-email">
                                <input id="txt-email" type="text" class="txt-input" placeholder="Email Address"/>
                            </label>
                            <button class="btn-blue btn-submit smaller" type="submit">Submit</button>
                        </div>
                    </form>
                </div>
            </div><!--end: .email-newsletter -->
            <div class="foot-menu">
                <div class="inner">
                    <h3 class="rs common-title">Menu</h3>
                    <ul class="rs">
                        <li><a href="index.html">Home</a></li>
                        <li><a href="about.html">About</a></li>
                        <li><a href="service.html">Service</a></li>
                        <li><a href="portfolio.html">Portfolio</a></li>
                        <li><a href="blog.html">Blog</a></li>
                        <li><a href="contact-us.html">Contact us</a></li>
                    </ul>
                </div>
            </div><!--end: .foot-menu -->
            <div class="clear"></div>
            <div class="lst-btn-social clearfix">
                <div class="grid_4"><a class="btn-invisible btn-twitter" href="#">Follow Us on Twitter</a></div>
                <div class="grid_4"><a class="btn-invisible btn-fb" href="#">Follow Us on Facebook</a></div>
                <div class="grid_4"><a class="btn-invisible btn-linkedin" href="#">Follow Us on LinkedIn</a></div>
            </div>
            <p class="rs copyright"><span class="lbl">Designed with love by</span> <a href="#" class="val">BestWebSoft.</a> - <span class="lbl">HTML version by</span> <a href="#">MegaDrupal</a> </p>
        </div>
    </footer><!--end: #footer -->
</div>
</body>
</html>